﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Cart.aspx.cs" Inherits="eCommerce.cms.Controls.Cart1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="~/css/style.css"/>
    <script src="~/js/jquery.js" type="text/javascript"></script>
    <script src="~/js/jquery.js" type="text/jaascript"></script>
    <script src="~/js/jquery.plum.js" type="text/javascript"></script>
    <script src="~/js/plum.shop.js" type="text/javascript"></script>
    <script src="~/js/example-plum-shop-configuration.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="page">
            <div id="header">
                <h1>
                    plum.shop, the JavaScript shopping cart</h1>
                <a href="http://codecanyon.net/item/plumshop-a-jquery-shopping-cart/427746?ref=robocreatif">
                    Grab plum.shop for only $6</a>
            </div>
            <div id="main">
                <div id="details">
                    <p>
                        plum.shop is a <strong>JavaScript shopping cart</strong> built on the jQuery library.
                        It's super easy to set up, has support for just about any necessity in an e-commerce
                        store, and at <strong>less than 25 KB</strong>, you get quite a bit of bang for
                        a very small footprint.
                    </p>
                    <h2 id="features">
                        plum.shop features</h2>
                    <ul>
                        <li><strong>AJAX-ready.</strong> Pages using plum.shop can be loaded with AJAX without
                            calling the plugin again</li>
                        <li>Build an entire store with simple, <strong>straightforward HTML markup</strong></li>
                        <li>Over <strong>30 customizable options</strong> and callback functions</li>
                        <li><strong>Multiple tax brackets</strong> for countries, regions and local taxes</li>
                        <li><strong>Multiple shipping</strong> options</li>
                        <li>5 included checkout methods including custom checkout, <strong>PayPal</strong>,
                            <strong>Google</strong>, <strong>Amazon</strong> and <strong>Skrill</strong></li>
                        <li>3 cart storage methods including <strong>HTML5 localStorage</strong>, <strong>browser
                            cookies</strong>, and <strong>server-side sessions</strong></li>
                        <li>Set up multiple carts per page</li>
                    </ul>
                    <h2 id="localization">
                        Localization</h2>
                    <ul>
                        <li>Custom, extremely easy-to-use <strong>currency formatting</strong></li>
                        <li><strong>Geolocation</strong> for taxes</li>
                    </ul>
                    <h2 id="shipping">
                        Fine-tuned shipping</h2>
                    <ul>
                        <li>Flat, fixed, variable or range shipping types.</li>
                        <li>Set costs in <strong>varying shipping brackets</strong> using the range type</li>
                    </ul>
                    <h2 id="taxes">
                        Powerful tax options</h2>
                    <ul>
                        <li>Single tax rate</li>
                        <li>Multiple taxes on a single order</li>
                        <li><strong>Regional taxes</strong> based on your customer's location</li>
                        <li>Use <strong>VAT</strong> or <strong>sales tax</strong></li>
                    </ul>
                    <h2 id="options">
                        Unlimited product options</h2>
                    <ul>
                        <li>Offer <strong>unlimited options</strong> for each of your products</li>
                        <li><strong>Automatically generate SKU numbers</strong> for various option combinations</li>
                        <li>Adjust prices per option</li>
                    </ul>
                    <hr>
                    <h2 id="browser-requirements">
                        Browser requirements</h2>
                    <ul>
                        <li>Mozilla Firefox 2 or newer</li>
                        <li>Google Chrome</li>
                        <li>Apple Safari 3 or newer</li>
                        <li>Opera 9 or newer</li>
                        <li>Microsoft Internet Explorer 7 or newer</li>
                    </ul>
                    <h2 id="software-requirements">
                        Software requirements</h2>
                    <ul>
                        <li>jQuery 1.4.1 or newer</li>
                    </ul>
                    <hr>
                    <h2 id="usage">
                        Pretty sweet. How do I use it?</h2>
                    <p>
                        <strong>Set up is a quick 4 steps.</strong> Plum will work on any page where you
                        load the necessary scripts, so you can have a gallery of products, single product
                        pages, and your checkout page all separated.
                    </p>
                    <ol>
                        <li>
                            <p>
                                Include jQuery and plum.shop.</p>
                            <pre>&lt;script src="/js/jquery.js"&gt;&lt;/script&gt;
&lt;script src="/js/jquery.plum.shop.js"&gt;&lt;/script&gt;</pre>
                        </li>
                        <li>
                            <p>
                                Set up your products. Any element with a "product" class (this can be changed) is
                                a cart container. You can have one, ten, a thousand containers on a page.
                            </p>
                            <pre>&lt;div class="product" id="sku-01"&gt;
	&lt;span class="title"&gt;My awesome product&lt;/div&gt;
	&lt;span class="price"&gt;$10.00&lt;/div&gt;
	&lt;input class="purchase"
		type="button"
		value="Add to cart"&gt;
&lt;/div&gt;</pre>
                        </li>
                        <li>
                            <p>
                                Create a container for the cart display.</p>
                            <pre>&lt;div id="cart"&gt;&lt;/div&gt;</pre>
                        </li>
                        <li>
                            <p>
                                Include your cart's configuration. This is where you can customize how each item
                                looks in the cart, create multiple carts, and add any options you may need.
                            </p>
                            <pre>&lt;script&gt;
$('#cart').plum('shop', {
	cartitem: '{title} &amp;mdash; {pricesingle} '
		+ '&amp;times; {quantity} &amp;mdash; '
		+ '{pricetotal}',
	paypaluser: 'hello',
	paypaldomain: 'robocreatif.com'
});
&lt;/script&gt;</pre>
                        </li>
                    </ol>
                    <hr>
                    <h2 id="notes">
                        Notes</h2>
                    <p class="note">
                        Please remember that plum.shop is pure JavaScript. While every precaution has been
                        taken to ensure the validity of items in your shopping cart, any JavaScript can
                        be easily manipulated. Therefore, we recommend that you always verify the contents
                        of an order before finalizing the transaction. You can do this by utilizing one
                        of the third-party payment gateway's notification services, like <a href="https://www.paypal.com/ipn">
                            PayPal's IPN</a>.
                    </p>
                    <p class="note">
                        plum.shop is a shopping cart and only a shopping cart. It serves to store products
                        that your customers have added to the cart, display and calculate totals and discounts,
                        and help out with the checkout process. Categories, product detail pages, and anything
                        else you might need in your store must be added in yourself.
                    </p>
                    <p class="note">
                        Finally, this page is a <em>demonstration</em> of some of plum.shop's capabilities.
                        It is not intended to be a drop-in solution for an e-commerce store. Some assembly
                        required. (Don't worry, there's a thorough documentation file.)
                    </p>
                </div>
                <div id="products">
                    <ul>
                        <li class="product" id="tank">
                            <img src="/images/tank.png" alt="">
                            <p>
                                <span class="title">Tank</span> <span class="price">$13.00</span><br>
                                <input class="purchase" type="button" value="Add to cart">
                            </p>
                        </li>
                        <li class="product" id="long-sleeve">
                            <img src="/images/long-sleeve.png" alt="">
                            <p>
                                <span class="title">Long Sleeve</span> <span class="price">$19.00</span><br>
                                <input class="purchase" type="button" value="Add to cart">
                            </p>
                        </li>
                        <li class="product" id="pants">
                            <img src="/images/pants.png" alt="">
                            <p>
                                <span class="title">Pants</span> <span class="price">$22.00</span><br>
                                <input class="purchase" type="button" value="Add to cart">
                            </p>
                        </li>
                        <li class="product" id="skirt">
                            <img src="/images/skirt.png" alt="">
                            <p>
                                <span class="title">Skirt</span> <span class="price">$15.00</span><br>
                                <input class="purchase" type="button" value="Add to cart">
                            </p>
                        </li>
                    </ul>
                    <hr>
                    <ul>
                        <li class="product details" id="shoe">
                            <img src="/images/shoe.png" alt="">
                            <div>
                                <h3 class="title">
                                    Shoe</h3>
                                <span class="price">$42.00</span>
                                <p class="description">
                                    The shoe's description. It's not very informative, but it sure is a description.
                                </p>
                                <hr>
                                <label>
                                    Size</label>
                                <select class="size">
                                    <option value="6">6</option>
                                    <option value="7">7</option>
                                    <option value="8">8</option>
                                    <option value="9">9</option>
                                </select><br>
                                <label>
                                    Color</label>
                                <select class="color">
                                    <option value="cyan">Cyan</option>
                                    <option value="magenta">Magenta</option>
                                    <option value="yellow">Yellow</option>
                                    <option value="black">Black</option>
                                </select>
                                <p>
                                    <input class="purchase" type="button" value="Add to cart"></p>
                            </div>
                        </li>
                    </ul>
                    <div id="cart">
                    </div>
                    <a class="empty" href="#">Empty cart</a>
                    <div id="totals">
                        <p>
                            In this demo, you can use the discount codes <code>10PERCENT</code> and <code>10DOLLARS</code>.
                            Tax is set to 8% of the subtotal for US residents.
                        </p>
                        <label>
                            Discount code</label>
                        <input class="discount"><br>
                        <select id="shippingoptions" class="shipping">
                            <option>Select a shipping method</option>
                        </select><br>
                        <p>
                            <label>
                                Total items</label>
                            <span class="cart-quantity">0</span><br>
                            <label>
                                Subtotal</label>
                            <span class="cart-subtotal">$0.00</span><br>
                            <label>
                                Shipping</label>
                            <span class="cart-shipping">$0.00</span><br>
                            <label>
                                Tax</label>
                            <span class="cart-tax">$0.00</span><br>
                            <label>
                                Discount</label>
                            <span class="cart-discount">$0.00</span><br>
                            <label>
                                Total</label>
                            <span class="cart-total">$0.00</span>
                        </p>
                    </div>
                    <div id="checkout">
                        <input class="checkout" type="button" value="Custom checkout">
                        <input class="amazon" type="button" value="Amazon">
                        <input class="google" type="button" value="Google">
                        <input class="paypal" type="button" value="PayPal">
                        <input class="skrill" type="button" value="Skrill">
                    </div>
                </div>
            </div>
            <div id="footer">
                &copy; 2011-2012 Jivallo
            </div>
        </div>
      
    </form>
</body>
</html>
